<template>
  <div class="department-container">
    <vab-query-form>
      <vab-query-form-left-panel>
        <el-button :icon="Plus" type="primary" @click="handleAdd">添加</el-button>
      </vab-query-form-left-panel>
    </vab-query-form>
    <el-table ref="tableRef" v-loading="listLoading" border :data="list">
      <el-table-column align="center" label="序号" width="55">
        <template #default="{ $index }">
          {{ $index + 1 }}
        </template>
      </el-table-column>
      <el-table-column align="left" label="审核人姓名" prop="accountName" show-overflow-tooltip />
      <el-table-column align="left" label="审核组别" min-width="200" show-overflow-tooltip>
        <template #default="{ row }">
          {{ row.departmentNames }}
        </template>
      </el-table-column>
      <el-table-column align="center" label="审核类型" min-width="100">
        <template #default="{ row }">
          {{ row.verifyType == 0 ? '同级审核' : '' }}
        </template>
      </el-table-column>
      <el-table-column align="center" fixed="right" label="操作" width="220">
        <template #default="{ row }">
          <el-button text type="primary" @click="handleEdit(row)">编辑</el-button>
          <el-button text type="danger" @click="handleDelete(row)">删除</el-button>
        </template>
      </el-table-column>
      <template #empty>
        <el-empty class="vab-data-empty" description="暂无数据" />
      </template>
    </el-table>
    <edit ref="editRef" @fetch-data="fetchData" />
  </div>
</template>
<script lang="ts" setup>
import { Plus } from '@element-plus/icons-vue'
import Edit from './components/Edit.vue'
import { verifyDelete as doDelete, getVerifyList as getList } from '/@/api/sys'
defineOptions({
  name: 'AccountVerify',
})
const $baseConfirm = inject<any>('$baseConfirm')
const $baseMessage = inject<any>('$baseMessage')

const tableRef = ref<any>(null)
const editRef = ref<any>(null)
const list = ref<any>([])
const listLoading = ref<boolean>(true)

const fetchData = async () => {
  listLoading.value = true
  const { data } = await getList()
  list.value = data
  listLoading.value = false
}
const handleAdd = () => {
  editRef.value.showEdit()
}

const handleEdit = (row = {}) => {
  editRef.value.showEdit(row)
}

const handleDelete = (row: any) => {
  if (row) {
    $baseConfirm('您确定要删除当前项吗', null, async () => {
      const { message }: any = await doDelete({ id: row.roleId })
      $baseMessage(message, 'success', 'hey')
      await fetchData()
    })
  }
}

onBeforeMount(() => {
  fetchData()
})
</script>
<style lang="scss" scoped></style>
